<template>
	<view class="page" v-if="checkPermission(['ROOT','MEETING:INSERT','MEETING:UPDATE'])">
		<view class="header">
			<input type="text" class="title" v-model="title" placeholder="输入加班内容" placeholder-class="title-placeholder">
			<image src="https://www.retoc.xyz/icon/icon-18.png" mode="widthFix" class="edit-icon"></image>
		</view>
		<view class="attr">
			<view class="list">
				<view class="item">
					<view class="key">
						开始日期
					</view>
					<picker v-if="canEdit" mode="date" :value="date" @change="startChange">
						<view class="uni-input">{{date}}</view>
					</picker>
				</view>
				<view class="item">
					<view class="key">
						开始时间
					</view>
					<picker v-if="canEdit" mode="time" :value="start" @change="startTimeChange">
						<view class="uni-input">{{startTime}}</view>
					</picker>
				</view>
				<view class="item">
					<view class="key">
						结束时间
					</view>
					<picker v-if="canEdit" mode="time" :value="end" @change="endTimeChange">
						<view class="uni-input">{{endTime}}</view>
					</picker>
				</view>
			</view>
			<view class="" @tap="editDesc">
				<text class="desc">{{reason}}</text>
			</view>
		</view>

		<button class="btn" @tap="save">保存</button>
		
		<uni-popup ref="popupDesc" type="dialog">
			<uni-popup-dialog mode="input" title="输入请假原因" placeholder="输入请假原因" :value="reason" @confirm="finishDesc">
			</uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	import uniPopup from '@/components/uni-popup/uni-popup.vue';
	import uniPopupMessage from '@/components/uni-popup/uni-popup-message.vue';
	import uniPopupDialog from '@/components/uni-popup/uni-popup-dialog.vue';
	export default {
		components: {
			uniPopup,
			uniPopupMessage,
			uniPopupDialog
		},
		data() {
			return {
				opt: null,
				id: null,
				uuid: null,
				canEdit: true,
				title: '',
				date: '',
				startTime:"18:00",
				endTime: '21:00',
				reason: '加班原因',
				instanceId: null
			};
		},
		onShow() {
			let that = this
			let pages = getCurrentPages()
			let currPage = pages[pages.length - 1]
			if (that.opt == 'insert') {
				let now = new Date()
				that.date = now.format("yyyy-MM-dd")
				
			} else if (that.opt == 'edit') {
				// console.log('meet.id', that.id);
				//获取数据
				that.ajax(that.url.selectOtById, 'POST', {
					id: that.id
				}, function(resp) {
					let result = resp.data.result;
					console.log("edit",result);
					that.uuid = result.uuid;
					that.title = result.title;
					that.startTime = result.startTime;
					that.endTime = result.endTime;
					that.date = result.start;
					let reason = result.reason;
					if (reason != null && reason != '') {
						that.reason = reason;
					}
					that.instanceId = result.instanceId;
				});
			}
			
		},
		onLoad(options) {
			this.id = options.id;
			this.opt = options.opt;
		},
		methods: {
			// toMembersPage: function() {
			// 	let array = []
			// 	for (let one of this.members) {
			// 		array.push(one.id);
			// 	}
			// 	uni.navigateTo({
			// 		url: '../members/members?members=' + array.join(',')
			// 	})
			// },
			startChange: function(e) {
				let now = new Date()
				now=now.format("yyyy-MM-dd")
				if (e.detail.value<now) {
					uni.showToast({
						icon: 'error',
						title: '时间已过期'
					})
					return
				}
				this.date = e.detail.value;
			},
			startTimeChange: function(e) {
				if (e.detail.value > this.endTime) {
					uni.showToast({
						icon: 'error',
						title: '不能晚于结束时间'
					})
					return
				}
				this.startTime = e.detail.value;
			},
			endTimeChange: function(e) {
				if (e.detail.value < this.startTime) {
					uni.showToast({
						icon: 'error',
						title: '不能早于开始时间'
					})
					return
				}
				this.endTime = e.detail.value;
			},
			editDesc() {
				if (!this.canEdit) {
					return
				}
				this.$refs.popupDesc.open()
			},
			finishDesc(done, value) {
				if (value != null && value != "") {
					this.reason = value
					done()
				} else {
					uni.showToast({
						icon: 'error',
						title: '内容不能为空'
					})
				}
			},
			save: function() {
				let that = this;
				// let array = [];
				// for (let one of that.members) {
				// 	array.push(one.id);
				// }
				//验证数据
				if (
					that.checkBlank(that.title, '请假标题') ||
					that.checkValidStartAndEnd(that.start, that.end)
				) {
					return;
				}
				uni.showLoading({
					title:'保存中...'
				})
				let data = {
					title: that.title,
					startTime: that.startTime,
					endTime: that.endTime,
					date: that.date,
					type: Number(that.typeIndex) + 1,
					// members: JSON.stringify(array),
					reason: that.reason,
					id: that.id,
					instanceId: that.instanceId
				};
				let url;
				if (that.opt == 'insert') {
					url = this.url.otRequest;
				} else if (that.opt == 'edit') {
					url = this.url.otUpdate;
				}
				that.ajax(url, 'POST', data, function(resp) {
					uni.hideLoading();
					uni.showToast({
						icon: 'success',
						title: '保存成功',
						complete: function() {
							setTimeout(function() {
								uni.navigateBack({});
							}, 2000);
						}
					});
				});
			},
		}
	}
</script>

<style lang="less">
@import url(ot.less);
</style>
